<template>
	<view id="body">
		<view class="navimg">
			<!-- 轮播图 -->
			<view class="u-demo-block">
				<u-swiper
					:list="goodsinfo.imglist"
					previousMargin="30"
					nextMargin="30"
					circular
					autoplay="true"
					interval=4000
					radius="5"
					bgColor="#ffffff"
				></u-swiper>
			</view>
		</view>
		<view class="order-price-sc">
			<view class="left-price">
				<text>￥</text>
				<text style="line-height: 56rpx;">{{goodsinfo.price}}</text>
			</view>
			<view class="right-sc">
				<u-icon name="star" color="#ffffff" size="28"></u-icon>
			</view>
		</view>
		<view class="order-conent">
			<view class="title">
				<text>商品名称:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.title}}</text>
			</view>
			<view class="content">
				<text>商品描述:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.content}}</text>
			</view>
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<view class="id">
				<text>商品编号:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.id}}</text>
			</view>
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<view class="type">
				<text>商品分类:</text>
				<text style="margin-left: 24rpx;">{{type[goodsinfo.type].name}}</text>
			</view>
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<view class="oldnew">
				<text>新旧程度:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.lodandnew}}</text>
			</view>
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<view class="specifications">
				<text>规格:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.norms}}</text>
			</view>
			<view class="xt"> 
				<u-line color="#acacac"></u-line>
			</view>
			<view class="sscolor">
				<text>颜色:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.color}}</text>
			</view>
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<view class="sscolor">
				<text>型号:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.model}}</text>
			</view>
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<view class="issusername">
				<text>卖家名称:</text>
				<text style="margin-left: 24rpx;">{{goodsinfo.issueUserName}}</text>
			</view>
			<view class="xt"> 
				<u-line color="#acacac"></u-line>
			</view>
		</view>
		<!-- 底部购物车 -->
		<view class="cart">
			<view class="xt">
				<u-line color="#acacac"></u-line>
			</view>
			<!-- 用户头像 -->
			<!-- <view class="issueUser" @click="contact" v-if="goodsinfo.state == 1">
				<text class="t-icon t-icon-xiaoxi" style="width: 68rpx; height: 68rpx;"></text>
			</view> -->
			<!-- 加入购物车 -->
			<!-- <view class="addcart" @click="addcart">
				<text>加入购物车</text>
			</view> -->
			<!-- 立即购买 -->
			<view class="ljfk" @click="ljfk">
				<text v-if="goodsinfo.state == -1">已下架</text>
				<text v-if="goodsinfo.state == 0">立即购买</text>
				<text v-if="goodsinfo.state == 1"  @click="contact">联系买家</text>
				<text v-if="goodsinfo.state == 3" >已完成</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {http} from "../static/service/requestAddress/rtas.js"
	export default {
		data() {
			return {
				//商品分类
				type:[
					{
						name:"电子产品",
					},
					{
						name:"生活用品",
					},
					{
						name:"学习用品",
					},
					{
						name:"交通工具",
					},
					{
						name:"其他",
					},
				],
				goodsinfo:{
					id:"",//商品id
					imglist:[],//商品图片信息
					type:0,//商品类型
					price:"",//商品价格
					title:"",//商品标题
					content:"",//订单内容
					lodandnew:"",//新旧程度
					norms:"",//规格
					color:"",//颜色
					model:"",//型号
					issueUserName:"",//发布用户
					number:1,//商品个数
					issueUserImg:"",//用户头像
					state:0,//订单状态
				},
			}
		},
		methods:{
			onLoad(options){ //页面接收信息
				console.log("接收的页面信息是:"+options.data)
				var data =  JSON.parse(options.data)
				this.goodsinfo = data
				this.goodsinfo.price = ""+data.price
				this.goodsinfo.imglist = data.orderImg.split(",") 
				this.goodsinfo.type = data.type - 1
			},
			//联系商家
			contact(){
				//添加用户到消息列表
				uni.navigateTo({
					url:"/see/chatpage"+"?id="+this.goodsinfo.issueUser+"&name="+this.goodsinfo.issueUserName+"&img="+this.goodsinfo.issueUserImg
				})
			},
			//添加购物车
			addcart(){
				uni.showLoading({
					title:"正在添加中",
					mask: true
				})
				//获取缓存数组
				var list = uni.getStorageSync("cartlist")
				//缓存为空
				if(list == ""){
					var falg = []
					falg.push(this.goodsinfo)
					uni.setStorageSync("cartlist",JSON.stringify(falg))
					uni.$u.toast("添加购物车成功!")
				}else{//有数据的情况
					var falg = JSON.parse(list)
					//查询是否是重复商品
					for(var i = 0;i<falg.length;i++){
						if(falg[i].id == this.goodsinfo.id){
							//商品已经存在
							uni.$u.toast("商品已在购物车!")
							return
						}
					}
					//不存在的情况
					falg.push(this.goodsinfo)
					uni.setStorageSync("cartlist",JSON.stringify(falg))
					uni.$u.toast("添加购物车成功!")
				}
			},
			ljfk(){
				var that = this
				//获取订单状态
				var promise =  new Promise(function(resolve,reject){
					uni.request({
						url:http+"tzmarket/orderstate/"+that.goodsinfo.id,
						method:"GET",
						complete:(res)=>{
							if(res.data.code == 20021){
								if(res.data.date == 1){
									uni.$u.toast("该订单以被人购买了喔")
									return
								}else{
									resolve()
								}
							}
						}
					})
				})
				promise.then(res=>{
					if(this.goodsinfo.state == 0){
								//封装请求对象
								var wxp = {
									//订单id
									orderid: this.goodsinfo.id,
									//获取的openid
									openid:"",
									//订单名称
									 name:this.goodsinfo.title,
									//订单价格
									 price:this.goodsinfo.price
								}
								var user = JSON.parse(uni.getStorageSync('user'))
								var url = http+"tzmarket/"
								uni.login({
									success(res) {
										uni.request({
											url: http+"wxlogin/"+res.code,
											method:"GET",
											success(res) {
												var openid = res.data.date
												wxp.openid = openid
												uni.request({
													url:http+"wxpay",
													data: wxp, 
													method:"POST",
													success(res) {
														var data = res.data.date
														var orderid = data.orderid.slice(0,19)
														uni.requestPayment({
															// "provider": data.provider,    //支付类型-固定值
															"timeStamp": data.timeStamp, // 时间戳（单位：秒）
															"nonceStr": data.nonceStr, // 随机字符串
															"package": data.packAge, // 固定值
															"signType": data.signType, //固定值
															"paySign": data.paySign, //签名
															    success(res) {
																	//支付成功后修改订单状态
																	console.log("请求的链接是:"+ url+orderid+"/"+user.id,)
																	uni.request({
																		url: url+orderid+"/"+user.id,
																		method:"PUT",
																		complete:(res) =>{
																			if(res.data.code == 20041){
																				uni.$u.toast("支付成功！")
																				setTimeout(()=>{
																					//支持成功后跳转到已支付订单里
																					uni.redirectTo({
																						url: "/myorder/order"
																					})
																				}, 1000);
																				
																			}else{
																				console.log("修改失败")
																			}
																		}
																	})
																}, 
															    fail(e) { 
																	uni.$u.toast("支付失败！")
																	console.log("支付失败！"+url)
																}
														})
													},
													fail(res) {
														uni.$u.toast("获取openid失败！")
													}
												})
											},
											fail(res) {
												uni.$u.toast("获取code失败！")
											}
										})
									},
									fail(res) {
										uni.$u.toast("获取登录信息失败！")
									}
								})
					}
				})
				
			}
		}
	}
</script> 

<style scoped>
	@import url("../static/css/componentsCss/tzmarketindex/tzmarketInfo.css");
</style>